<template>
    <div class="content file-check">
        <div>
            <!-- 轮播图 -->
            <div @click="goLocate">
                <carousel></carousel>
            </div>
            
            <!-- 产品价值、合作团队、服务流程 -->
            <main-content></main-content>

            <!-- 标书代检 -->
            <div class="title" id="title">标书代检</div>
            <div class="daijian">
                <client-only>
                    <form-section @update="formSubmit" :isLogin="isLogin"></form-section>
                </client-only>

                <!-- 历史记录 -->
                <div v-if="isLogin" class="history">
                    <list-section slot="sub" ref="list" id="history"></list-section>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import {buildTdk} from '@config/tdk';

import AdvRow from './components/adv-row';

import FormSection from './section/form/index';
import ListSection from './section/list/index';

import advImg from './assets/images/adv.jpg';

import leaflets from './components/leaflets.vue';
import carousel from './section/carousel.vue';
import mainContent from './section/main-content.vue';

export default {
    head() {
        return buildTdk('fileCheck');
    },
    layout: 'client',
    components: {
        AdvRow,
        FormSection,
        ListSection,
        leaflets,
        carousel,
        mainContent,
    },
    data() {
        return {
            advImg,
            isLogin: null,
        };
    },
    methods: {
        formSubmit() {
            if(!this.$refs.list){ return };
            this.$refs.list.queryData();

            this.$refs.list.$el.scrollIntoView();
        },

        //检查是否登录。 未登录-宣传页
        checkLoginHandler() {
            this.$store.dispatch('userinfo/checkIsLoginNoDoing', {
                login: () => {
                    this.isLogin = true;
                },
                noLogin: () => {
                    this.isLogin = false;
                },
            });
        },

        goLocate(){
            document.getElementById("title").scrollIntoView();
        },
    },
    mounted() {
        this.checkLoginHandler();
    },
};
</script>

<style lang="scss" scoped>
.file-check {
    margin: 12px auto;
    .section-item {
        background: white;
    }
    .no-login {
        position: relative;

        .login-con {
            position: absolute;
            left: 50%;
            top: 10%;
            transform: translate(-50%, -50%);
            background: white;
            padding: 20px 0;
            width: 600px;
            text-align: center;
            box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.13);
        }
    }
}

.title {
    font-size: 20px;
    color: #252525;
    margin: 30px auto;
    text-align: center;
    font-weight: 600;
}

.daijian {
    // padding: 27px;
    border: 1px solid #ccc;
    .history {
        padding: 0 27px;
        border-top: 1px solid #ccc;
    }
}
</style>